<?php
	require_once '../../core/Debug.php'; //System Debug...
	require_once '../../core/config.php';//System Config...
	require_once '../../core/Init.php';  //System Init...

	$img_server_number	= $_GET['isn'];
	$img_path			= $_GET['ipath'];
	$user_id			= $_GET['u'];
	
	$listName			= $_GET['ln'];
	$minWidth 			= $_GET['pw'];
	$jsMinHeight 		= $_GET['ph'];
	
	if(!User::have_permit(ADMIN_ITEM) || $img_server_number == '' || $img_path == '' || !isset(CGlobal::$img_server[$img_server_number]))
	exit;
	
	
	$img_server_path 	= CGlobal::$img_server[$img_server_number];
	$img 				= 'http://' . $img_server_path . UP_FOLDER ."/".$img_path;
	
	function GetImageViewSize($limitWidth,$limitHeight,$imgWidth,$imgHeight)
	{
		$retVal['width'] = $imgWidth;
		$retVal['height'] = $imgHeight;
		
		if($limitHeight&&($imgHeight >= $limitHeight))
		{
			$retVal['width'] = (int)($limitHeight*$imgWidth/$imgHeight);
			$retVal['height'] = $limitHeight;
		}
		
		if($limitWidth&&($retVal['width'] >= $limitWidth))
		{
			$retVal['width'] = $limitWidth;
			$retVal['height'] = (int)($limitWidth*$imgHeight/$imgWidth);
		}
		return $retVal;
	}

	if(!$jsMinHeight)
	{
		$minHeight	= $minWidth*1.5;
	}
	else
	{
		$minHeight 	= $jsMinHeight;
	}
	
	
	list($imgWidth, $imgHeight, $imgType) = getimagesize($img);
	$fullSize 	= GetImageViewSize(450,350,$imgWidth, $imgHeight);
	
	// Chuẩn bị toạ độ để tạo sẵn selection ở giữa ảnh
	if(($fullSize['width']/$fullSize['height']) < ($minWidth/$minHeight))
	{
		$x1 = 0;
		$y1 = (int)(($fullSize['height'] - $fullSize['width']*$minHeight/$minWidth)/2);
		$x2 = (int)($x1 + $fullSize['width']);
		$y2 = (int)($y1 + $fullSize['width']*$minHeight/$minWidth);
	}
	else
	{
		$x1 = (int)(($fullSize['width'] - $fullSize['height']*$minWidth/$minHeight)/2);
		$y1 = 0;
		$x2 = (int)($x1 + $fullSize['height']*$minWidth/$minHeight);
		$y2 = (int)($y1 + $fullSize['height']);
	}
	
	$selW 		= $x2 - $x1;
	$selH		= $y2 - $y1;
	
	$preSelW	= $minWidth;
	$preSelH	= (int)($minWidth*$selH/$selW);
	$preX1		= $x1*$preSelW/$selW;
	$preY1		= $y1*$preSelH/$selH;

	$preview['width'] 	= (int)($fullSize['width']*$preSelW/$selW);
	$preview['height'] 	= (int)($fullSize['height']*$preSelH/$selH);
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="../../style/enbacStyle.css" rel="stylesheet" type="text/css" />
<link href="../../style/style201005.css?v=3" rel="stylesheet" type="text/css" />


<link rel="stylesheet" href="../../style/imgareaselect-default.css" />
<script type="text/javascript" src="../../javascript/jquery/jquery.js?v=1.2.6.packed"></script>
<script type="text/javascript" src="../../javascript/jquery/jquery.imgareaselect.js"></script>
<script type="text/javascript" src="../../javascript/jquery/packed/jquery.blockUI.js"></script>
<script type="text/javascript" src="../../javascript/AC_RunActiveContent.js"></script>
<script type="text/javascript" src="../../javascript/si.files.js"></script>
<script type="text/javascript" src="../../javascript/ajaxfileupload.js"></script>
<script type="text/javascript" src="../../javascript/swfupload/swfupload.js"></script>
<script type="text/javascript" src="../../javascript/swfupload/js/swfupload.swfobject.js"></script>
<script type="text/javascript" src="../../javascript/swfupload/js/swfupload.queue.js"></script>
<script type="text/javascript" src="../../javascript/swfupload/js/fileprogress.js"></script>
<script>
	var WEB_DIR 		= "<?=WEB_DIR?>";
	var img_server	 	= <?php echo json_encode(CGlobal::$img_server); ?>;
	var img_sp			= '<?php echo $img_server_path; ?>';
	var img_path		= '<?php echo $img_path; ?>';
	var imgAS;
	var is_can_edit		= <?php echo (int)(User::have_permit(ADMIN_ITEM)); ?>;
	var user_id			= <?php echo $user_id; ?>;
	var demoListName 	= '<?php echo $listName; ?>';
	var demoPreviewWidth = <?php echo $minWidth; ?>;
	var demoPreviewHeight = <?php echo $jsMinHeight; ?>;
	var x1 = <?php echo $x1; ?>;
	var x2 = <?php echo $x2; ?>;
	var y1 = <?php echo $y1; ?>;
	var y2 = <?php echo $y2; ?>;
	
	var imgWidth 		= <?php echo $fullSize['width']?$fullSize['width']:0; ?>;
	var imgHeight		= <?php echo $fullSize['height']?$fullSize['height']:0; ?>;
	var preSelWidth		= <?php echo $preSelW; ?>;
	var preSelHeight	= <?php echo $preSelH; ?>;
		
	function preview(img, selection) { 
		if(selection)
		{
			var previewHeight = preSelHeight;
			var selWidth = selection.width;
			var selHeight = selection.height;
			
			// Nếu không fix cứng tỉ lệ của khung chọn crop, xác định height tự động theo tỉ lệ của khung chọn crop
			if(!demoPreviewHeight)
			{
				// Không cho phép width của khung chọn crop > 1,5 lần height khung chọn crop và ngược lại
				if(selection.width > 1.5*selection.height)
				{
					selWidth = 1.5*selection.height;
					selection.x2 = selection.x1 + selWidth;
				}
				else if(selection.height > 1.5*selection.width)
				{
					selHeight = 1.5*selection.width;
					selection.y2 = selection.y1 + selHeight;
				}
				// Đặt lại khung chọn crop
				imgAS.setSelection(selection.x1,selection.y1,selection.x2,selection.y2);
				imgAS.update();
				
				previewHeight = selHeight * preSelWidth / selWidth;
			}
			// Gán height cho div bao khung preview
			jQuery('#imgPreviewWrapper_' + demoListName).css({height:previewHeight});
			
			var scaleX = demoPreviewWidth / selWidth; 
			var scaleY = previewHeight / selHeight; 
			
			jQuery('#itemAvatarPreview_' + demoListName).css({ 
				width: Math.round(scaleX * imgWidth) + 'px', 
				height: Math.round(scaleY * imgHeight) + 'px',
				marginLeft: '-' + Math.round(scaleX * selection.x1) + 'px', 
				marginTop: '-' + Math.round(scaleY * selection.y1) + 'px' 
			});
			/*jQuery('#imgCropMessage').html(
								 'demoPreviewHeight : ' + demoPreviewHeight + '<br />' +
								 'demoPreviewWidth : ' + demoPreviewWidth + '<br />' + 
								 'selection.width : ' + selection.width + '<br />' + 
								 'selection.height : ' + selection.height + '<br />' + 
				'scaleX: ' + scaleX + '<br /> scaleY: ' + scaleY + 
				'<br /> width: ' + Math.round(scaleX * imgWidth) + 'px<br /> ' + 
				'height: ' + Math.round(scaleY * imgHeight) + 'px<br />' +
				'marginLeft: -' + Math.round(scaleX * selection.x1) + 'px<br /> ' + 
				'marginTop: -' + Math.round(scaleY * selection.y1) + 'px<br /> ' + 
				'imgWidth: ' + imgWidth +
				'<br /> imgHeight: ' + imgHeight +
				'<br /> selection.x1: ' + selection.x1 +
				'<br /> selection.y1: ' + selection.y1 + 
				'<br /> previewHeight: ' + previewHeight
				);*/
			
			jQuery('#cropX1').val(selection.x1);
			jQuery('#cropY1').val(selection.y1);
			jQuery('#cropX2').val(selection.x2);
			jQuery('#cropY2').val(selection.y2);
			jQuery('#cropWidth').val(selWidth);
			jQuery('#cropHeight').val(selHeight);
		}
	} 
	
	function SetImgAreaSelect()
	{
		// Xác định lại crop selection
		imgAS = jQuery('#itemAvatarFullSize').imgAreaSelect({ 
			instance:true, 
			handles: true, 
			show:true,
			parent: '#image_tool_part',
			onSelectChange: preview 
		}); 
		
		var opt = imgAS.getOptions();
		
		opt.aspectRatio = '';
		opt.minWidth = 120;
		opt.minHeight = 200;
		
		/*var imgWidth 	= jQuery('#displayWidth').val();
		var imgHeight	= jQuery('#displayHeight').val();
		opt.minWidth	= jQuery('#displayWidth').val()*opt.minWidth/jQuery('#actualWidth').val();
		opt.minHeight 	= jQuery('#displayHeight').val()*opt.minHeight/jQuery('#actualHeight').val();*/
		
		// Nếu kích thước ảnh nhỏ hơn kích thước tối thiểu của khung chọn crop, điều chỉnh kích thước tối thiểu của khung chọn crop về kích thước ảnh
		if(opt.minWidth > imgWidth)
		{
			opt.minHeight = opt.minWidth * imgWidth / opt.minHeight;
			opt.minWidth = imgWidth;
		}
		
		if(opt.minHeight > imgHeight)
		{
			opt.minWidth = opt.minHeight * imgHeight / opt.minWidth;
			opt.minHeight = imgHeight;
		}
		
		
		imgAS.setOptions(opt);
				
		imgAS.setSelection(x1,y1,x2,y2);
		
		imgAS.update();	
		jQuery('#cropX1').val(x1);
		jQuery('#cropY1').val(y1);
		jQuery('#cropX2').val(x2);
		jQuery('#cropY2').val(y2);
		jQuery('#cropWidth').val(x2-x1);
		jQuery('#cropHeight').val(y2-y1);
	}
	
	function CropImage()
	{
		/*jQuery("#frmCrop").livequery("submit",function(){	
													   alert('here');
			jQuery(this).ajaxSubmit({beforeSubmit:showCropRequest, success:showCropResponse, url:WEB_DIR+'ajax.php?act=upload&code=crop_image'+(is_can_edit?'&user_id='+item_user_id:''), dataType:  'json'});
			return false;
		});*/
		jQuery('#btnEditImageSubmit').click(function(){
			// Trường hợp không chọn vùng crop thì không cho phép crop ảnh
			if((jQuery("#cropX1").val() == 0)&&(jQuery("#cropY1").val() == 0)&&(jQuery("#cropWidth").val() == jQuery("#displayWidth").val())&&(jQuery("#cropHeight").val() == jQuery("#displayHeight").val()))
			{
				alert('Bạn chưa thiết lập vùng chọn để crop ảnh!');
				return false;
			}
			else// if(confirm("Bạn chắn chắn muốn crop ảnh?"))
			{
				jQuery.ajax({
					type: "POST",
					url: WEB_DIR+'ajax.php?act=upload&code=crop_image'+(is_can_edit?'&user_id='+user_id:''),
					data: {
							cropX1 					: jQuery("#cropX1").val(),
							cropY1 					: jQuery("#cropY1").val(),
							cropWidth 				: jQuery("#cropWidth").val(),
							cropHeight 				: jQuery("#cropHeight").val(),
							displayWidth 			: jQuery("#displayWidth").val(),
							displayHeight 			: jQuery("#displayHeight").val(),
							imgServerPath			: img_sp,
							imgPath					: img_path
						},
					dataType: 'json',
					success: function(retVal){
						if(retVal.result)
						{
							var avatar 						= new Array();
							avatar['img_server']			= retVal.img_server;
							avatar['img_url']	= retVal.img_url;
							// Đóng edit image popup
							//CloseCrop();
							parent.ItemUnblockUI();
							parent.DoChangeItemAvatar(avatar);
							
							/*DoChangeItemAvatar(retVal);
							jQuery('#itemAvatarPreview_' + demoListName).css({ 
								marginLeft: '0px', 
								marginTop: '0px' 
							});
							reload_gallery();*/
						}
						else
						{
							alert(retVal.message);
						}
					}
				});
				return true;
			}
			return false;
		});
	}
	
	if (window.ie6) try {document.execCommand("BackgroundImageCache", false, true);} catch(e){};

	
	jQuery(window).load(function()
	{
		jQuery('.demoList').css('display','none');
		
		jQuery('#demo'+demoListName).css('display','inline');
		
		SetImgAreaSelect();
		
		CropImage();
		
		// Click nút Hủy bỏ
		jQuery("#btnEditImageCancel").click(function(){
			//CloseCrop();
			parent.ItemUnblockUI();
			
		});
		
		//Click the x event!
		jQuery("#popupClose").click(function(){
			parent.ItemUnblockUI();
		});
		
		//Press Escape event!
		jQuery(document).unbind('keypress'); 
		jQuery(document).keydown(function(e){ //my code });
			if(e.keyCode==27){
				//CloseCrop();
				parent.ItemUnblockUI();
			}
		});
	});

	
	function ajaxFileUpload()
	{
		jQuery("#fastUploadProgress")
		.ajaxStart(function(){
			jQuery(this).show();
		})
		.ajaxComplete(function(){
			jQuery(this).hide();
		});
	
		jQuery.ajaxFileUpload
		(
			{
				url:WEB_DIR + 'includes/ajax_action/ajax_upload.php'+(is_can_edit?'?user_id='+user_id:''),
				secureuri:false,
				fileElementId:'fast_upload_avatar',
				dataType: 'json',
				success: function (data, status)
				{
					if(typeof(data.error) != 'undefined')
					{
						var avatar 						= new Array();
						avatar['img_server']			= data.img_server;
						avatar['img_url']	= data.image_url;
						parent.DoChangeItemAvatar(avatar);
						parent.OpenCropImagePopup('includes/popup/popcropimage.php?isn=' +data.img_server + '&ipath=' + data.image_url);
					}
				},
				error: function (data, status, e)
				{
					alert(e.message + data);
				}
			}
		)
		
		return false;
	
	}
	
	
	/* **********************
	   Event Handlers
	   These are my custom event handlers to make my
	   web application behave the way I went when SWFUpload
	   completes different tasks.  These aren't part of the SWFUpload
	   package.  They are part of my application.  Without these none
	   of the actions SWFUpload makes will show up in my application.
	   ********************** */
	
	function swfUploadPreLoad() {
		var self = this;
		var loading = function () {
			//document.getElementById("divSWFUploadUI").style.display = "none";
			document.getElementById("divLoadingContent").style.display = "";
	
			var longLoad = function () {
				document.getElementById("divLoadingContent").style.display = "none";
				document.getElementById("divLongLoading").style.display = "";
			};
			this.customSettings.loadingTimeout = setTimeout(function () {
					longLoad.call(self)
				},
				15 * 1000
			);
		};
		
		this.customSettings.loadingTimeout = setTimeout(function () {
				loading.call(self);
			},
			1*1000
		);
	}
	function swfUploadLoaded() {
		var self = this;
		clearTimeout(this.customSettings.loadingTimeout);
		//document.getElementById("divSWFUploadUI").style.visibility = "visible";
		//document.getElementById("divSWFUploadUI").style.display = "block";
		document.getElementById("divLoadingContent").style.display = "none";
		document.getElementById("divLongLoading").style.display = "none";
		document.getElementById("divAlternateContent").style.display = "none";
		
		//document.getElementById("btnBrowse").onclick = function () { self.selectFiles(); };
		//document.getElementById("btnCancel").onclick = function () { self.cancelQueue(); };
	}
	   
	function swfUploadLoadFailed() {
		clearTimeout(this.customSettings.loadingTimeout);
		//document.getElementById("divSWFUploadUI").style.display = "none";
		document.getElementById("divLoadingContent").style.display = "none";
		document.getElementById("divLongLoading").style.display = "none";
		document.getElementById("divAlternateContent").style.display = "";
	}
	   
	   
	function fileQueued(file) {
		try {
			var progress = new FileProgress(file, this.customSettings.progressTarget);
			progress.setStatus("Pending...");
			progress.toggleCancel(true, this);
	
		} catch (ex) {
			this.debug(ex);
		}
	
	}
	
	function fileQueueError(file, errorCode, message) {
		try {
			if (errorCode === SWFUpload.QUEUE_ERROR.QUEUE_LIMIT_EXCEEDED) {
				alert("You have attempted to queue too many files.\n" + (message === 0 ? "You have reached the upload limit." : "You may select " + (message > 1 ? "up to " + message + " files." : "one file.")));
				return;
			}
	
			var progress = new FileProgress(file, this.customSettings.progressTarget);
			progress.setError();
			progress.toggleCancel(false);
	
			switch (errorCode) {
			case SWFUpload.QUEUE_ERROR.FILE_EXCEEDS_SIZE_LIMIT:
				progress.setStatus("File is too big.");
				this.debug("Error Code: File too big, File name: " + file.name + ", File size: " + file.size + ", Message: " + message);
				break;
			case SWFUpload.QUEUE_ERROR.ZERO_BYTE_FILE:
				progress.setStatus("Cannot upload Zero Byte files.");
				this.debug("Error Code: Zero byte file, File name: " + file.name + ", File size: " + file.size + ", Message: " + message);
				break;
			case SWFUpload.QUEUE_ERROR.INVALID_FILETYPE:
				progress.setStatus("Invalid File Type.");
				this.debug("Error Code: Invalid File Type, File name: " + file.name + ", File size: " + file.size + ", Message: " + message);
				break;
			default:
				if (file !== null) {
					progress.setStatus("Unhandled Error");
				}
				this.debug("Error Code: " + errorCode + ", File name: " + file.name + ", File size: " + file.size + ", Message: " + message);
				break;
			}
		} catch (ex) {
			this.debug(ex);
		}
	}
	
	function fileDialogComplete(numFilesSelected, numFilesQueued) {
		try {
			/*if (numFilesSelected > 0) {
				document.getElementById(this.customSettings.cancelButtonId).disabled = false;
			}*/
			
			/* I want auto start the upload and I can do that here */
			this.startUpload();
		} catch (ex)  {
			this.debug(ex);
		}
	}
	
	function uploadStart(file) {
		try {
			/* I don't want to do any file validation or anything,  I'll just update the UI and
			return true to indicate that the upload should start.
			It's important to update the UI here because in Linux no uploadProgress events are called. The best
			we can do is say we are uploading.
			 */
			jQuery.blockUI({  message: jQuery('#divSWFUploadUI')  , overlayCSS: { opacity: 0 }, css: { 
				border: '1px solid #ccc',
				width:'358px'
			}});
			
			var progress = new FileProgress(file, this.customSettings.progressTarget);
			progress.setStatus("Uploading...");
			progress.toggleCancel(true, this);
		}
		catch (ex) {}
		
		return true;
	}
	
	function uploadProgress(file, bytesLoaded, bytesTotal) {
		try {
			var percent = Math.ceil((bytesLoaded / bytesTotal) * 100);
	
			var progress = new FileProgress(file, this.customSettings.progressTarget);
			progress.setProgress(percent);
			progress.setStatus("Uploading...");
		} catch (ex) {
			this.debug(ex);
		}
	}
	
	function uploadSuccess(file, serverData) {
		try {
			var arrResult = serverData.split(',');
			if(arrResult[0] == 'success')
			{
				//Reload iframe
				parent.OpenCropImagePopup('includes/popup/popcropimage.php?isn=' +arrResult[2] + '&ipath=' + arrResult[3]);
			}
			
			var progress = new FileProgress(file, this.customSettings.progressTarget);
			progress.setComplete();
			progress.setStatus("Complete.");
			progress.toggleCancel(false);
	
		} catch (ex) {
			this.debug(ex);
		}
	}
	
	function uploadError(file, errorCode, message) {
		try {
			var progress = new FileProgress(file, this.customSettings.progressTarget);
			progress.setError();
			progress.toggleCancel(false);
	
			switch (errorCode) {
			case SWFUpload.UPLOAD_ERROR.HTTP_ERROR:
				progress.setStatus("Upload Error: " + message);
				this.debug("Error Code: HTTP Error, File name: " + file.name + ", Message: " + message);
				break;
			case SWFUpload.UPLOAD_ERROR.UPLOAD_FAILED:
				progress.setStatus("Upload Failed.");
				this.debug("Error Code: Upload Failed, File name: " + file.name + ", File size: " + file.size + ", Message: " + message);
				break;
			case SWFUpload.UPLOAD_ERROR.IO_ERROR:
				progress.setStatus("Server (IO) Error");
				this.debug("Error Code: IO Error, File name: " + file.name + ", Message: " + message);
				break;
			case SWFUpload.UPLOAD_ERROR.SECURITY_ERROR:
				progress.setStatus("Security Error");
				this.debug("Error Code: Security Error, File name: " + file.name + ", Message: " + message);
				break;
			case SWFUpload.UPLOAD_ERROR.UPLOAD_LIMIT_EXCEEDED:
				progress.setStatus("Upload limit exceeded.");
				this.debug("Error Code: Upload Limit Exceeded, File name: " + file.name + ", File size: " + file.size + ", Message: " + message);
				break;
			case SWFUpload.UPLOAD_ERROR.FILE_VALIDATION_FAILED:
				progress.setStatus("Failed Validation.  Upload skipped.");
				this.debug("Error Code: File Validation Failed, File name: " + file.name + ", File size: " + file.size + ", Message: " + message);
				break;
			case SWFUpload.UPLOAD_ERROR.FILE_CANCELLED:
				// If there aren't any files left (they were all cancelled) disable the cancel button
				/*if (this.getStats().files_queued === 0) {
					document.getElementById(this.customSettings.cancelButtonId).disabled = true;
				}*/
				progress.setStatus("Cancelled");
				progress.setCancelled();
				break;
			case SWFUpload.UPLOAD_ERROR.UPLOAD_STOPPED:
				progress.setStatus("Stopped");
				break;
			default:
				progress.setStatus("Unhandled Error: " + errorCode);
				this.debug("Error Code: " + errorCode + ", File name: " + file.name + ", File size: " + file.size + ", Message: " + message);
				break;
			}
		} catch (ex) {
			this.debug(ex);
		}
	}
	
	function uploadComplete(file) {
		jQuery('#fsUploadProgress').html('');
		jQuery.unblockUI();
		
		/*if (this.getStats().files_queued === 0) {
			document.getElementById(this.customSettings.cancelButtonId).disabled = true;
		}*/
	}
	
	// This event comes from the Queue Plugin
	function queueComplete(numFilesUploaded) {
		//var status = document.getElementById("divStatus");
		//status.innerHTML = numFilesUploaded + " file" + (numFilesUploaded === 1 ? "" : "s") + " uploaded.";
	}
</script>
<style>
	.ovl_list_img_header{float:left;height:37px;background:#034b8a;width:100%;font-size:16px;cursor:move;color:#fff;position:relative;text-indent:10px;line-height:37px;font-weight:bold; text-align:left;}
	.demoList{margin-bottom:10px;}
	#ovl_content{float:left;background:#FFF;width:694px;}
	#img-list{float:left;margin:0;background:#FFF;width:670px; margin:10px 0 10px 10px;}
	#img-list .img-list-view{height:154px}
	#img-list .img-list-view .img-list-view-prev{float:left;width:17px;background:#f4f4f4 url(../../style/images/postItem/btn_prev.png) no-repeat center 72px;height:154px;cursor:pointer}
	#img-list .img-list-view .img-list-view-next{float:left;width:17px;background:#f4f4f4 url(../../style/images/postItem/btn_next.png) no-repeat center 72px;height:154px;cursor:pointer}
	#img-list .img-list-view .img-list-view-img{float:left;width:706px;*width:710px}
	#img-list .img-list-view .img-list-view-box{border:#D0D4D3 1px solid;background:#FFF;height:70px;width:70px;margin:0px 5px 10px;float:left}
	#img-list .img-list-view .img-list-view-box .img-list-view-box-number{float:left;background:#d6dee9;text-align:center;font-weight:bold;color:#000;padding:1px 5px;}
	
	#img-list .img-list-tool{float:left;width:100%;border-bottom:1px solid #d8dfea;margin-bottom:10px;background:#f8f9fd}
	#img-list .img-list-tool .img-list-tool-content{float:left;width:670px;margin:0;text-align:left}
	#img-list .img-list-tool .img-list-tool-content .img-list-tool-box{float:left;width:181px}
	#img-list .img-list-tool .img-list-tool-content .img-list-tool-box .img-list-tool-guide{border:1px solid #fae39f;background:#fffee9;padding:20px;height:76px;color:#000;font-size:11px;text-align:justify}
	#img-list .img-list-tool .img-list-tool-content .img-list-tool-img{float:left;margin-left:25px; position:relative; margin-bottom: 10px;}
	#img-list .img-list-tool .img-list-tool-content .btnImgSave{float:left;width:100%;margin-top:20px}
	#img-list #demoListItem{float:left;width:100%; position: relative; display:inline;}
	
	/* Css để hiển thị popup, thêm bởi Triệu Hưng 2010-06-22 */
	#background{
		display:none;
		position:fixed;
		_position:absolute; /* hack for internet explorer 6*/
		height:100%;
		width:100%;
		top:0;
		left:0;
		background:#000000;
		border:1px solid #cecece;
		z-index:1;
	}
	
	.popupWindow{
		display:none;
		text-align:center;
		position:fixed;
		_position:absolute; /* hack for internet explorer 6*/
	}
	
	/*DungNH added 23/06/2010*/
	.btnOvlSplit, .btnOvlSplitOver{background:url(../../style/images/postItem/btnOvlSplit.gif) no-repeat left top;width:56px;height:21px;border:0;margin-left:-5px;cursor:pointer}
	.btnOvlSplitOver{background:url(../../style/images/postItem/btnOvlSplit.gif) no-repeat left -21px}
	.btnOvlCancel, .btnOvlCancelOver{background:url(../../style/images/postItem/btnOvlCancel.gif) no-repeat left top;width:56px;height:21px;border:0;margin-left:-5px;cursor:pointer}
	.btnOvlCancelOver{background:url(../../style/images/postItem/btnOvlCancel.gif) no-repeat left -21px}
	
	.postItemOtherAvatar-choiceImg{float:left;width:125px;background:url(../../style/images/postItem/choice_img_other.gif) no-repeat left;padding-left:21px; }
	/* SWF upload dialog*/
	#divSWFUploadUI{display:none; float:left;}
	div.fieldset {
		border:  1px solid #afe14c;
		margin: 10px 0;
		padding: 20px 10px;
	}
	div.fieldset span.legend {
		position: relative;
		background-color: #FFF;
		padding: 3px;
		top: -30px;
		font: 700 14px Arial, Helvetica, sans-serif;
		color: #73b304;
	}
	
	div.flash {
		width: 375px;
		margin: 10px 5px;
		border-color: #D9E4FF;
	
		-moz-border-radius-topleft : 5px;
		-webkit-border-top-left-radius : 5px;
		-moz-border-radius-topright : 5px;
		-webkit-border-top-right-radius : 5px;
		-moz-border-radius-bottomleft : 5px;
		-webkit-border-bottom-left-radius : 5px;
		-moz-border-radius-bottomright : 5px;
		-webkit-border-bottom-right-radius : 5px;
	
	}
	
	#btnSubmit { margin: 0 0 0 155px ; }
	
	.progressWrapper {
		width: 357px;
		overflow: hidden;
	}
	
	.progressContainer {
		margin: 5px;
		padding: 4px;
		border: solid 1px #E8E8E8;
		background-color: #F7F7F7;
		overflow: hidden;
	}
	/* Message */
	.message {
		margin: 1em 0;
		padding: 10px 20px;
		border: solid 1px #FFDD99;
		background-color: #FFFFCC;
		overflow: hidden;
	}
	/* Error */
	.red {
		border: solid 1px #B50000;
		background-color: #FFEBEB;
	}
	
	/* Current */
	.green {
		border: solid 1px #DDF0DD;
		background-color: #EBFFEB;
	}
	
	/* Complete */
	.blue {
		border: solid 1px #CEE2F2;
		background-color: #F0F5FF;
	}
	
	.progressName {
		font-size: 8pt;
		font-weight: 700;
		color: #555;
		width: 323px;
		height: 14px;
		text-align: left;
		white-space: nowrap;
		overflow: hidden;
	}
	
	.progressBarInProgress,
	.progressBarComplete,
	.progressBarError {
		font-size: 0;
		width: 0%;
		height: 2px;
		background-color: blue;
		margin-top: 2px;
	}
	
	.progressBarComplete {
		width: 100%;
		background-color: green;
		visibility: hidden;
	}
	
	.progressBarError {
		width: 100%;
		background-color: red;
		visibility: hidden;
	}
	
	.progressBarStatus {
		margin-top: 2px;
		width: 337px;
		font-size: 7pt;
		font-family: Arial;
		text-align: left;
		white-space: nowrap;
	}
	
	
	.swfupload {
				position: absolute;
				z-index: 1001;
				}
	
	.SI-FILES-STYLIZED label.cabinet
	{
		width: 105px;
		height: 26px;
		padding-left:21px;
		background: url(../../style/images/postItem/choice_img_other.gif) 0 0 no-repeat;
		position:absolute;
		display: block;
		overflow: hidden;
		cursor: pointer;
	}
	
	.SI-FILES-STYLIZED label.cabinet input.file
	{
		position: relative;
		height: 100%;
		width: auto;
		width:100px;
		opacity: 0;
		-moz-opacity: 0;
		
		filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
	}
</style>
</head>

<body>
    <div id="divSWFUploadUI">
        <div id="fsUploadProgress">
        </div>
        <noscript style="background-color: #FFFF66; border-top: solid 4px #FF9966; border-bottom: solid 4px #FF9966; margin: 10px 25px; padding: 10px 15px;">
            We're sorry.  SWFUpload could not load.  You must have JavaScript enabled to enjoy SWFUpload.
        </noscript>
        <div id="divLoadingContent" class="content" style="background-color: #FFFF66; border-top: solid 4px #FF9966; border-bottom: solid 4px #FF9966; margin: 10px 25px; padding: 10px 15px; display: none;">
            SWFUpload is loading. Please wait a moment...
        </div>
        <div id="divLongLoading" class="content" style="background-color: #FFFF66; border-top: solid 4px #FF9966; border-bottom: solid 4px #FF9966; margin: 10px 25px; padding: 10px 15px; display: none;">
            SWFUpload is taking a long time to load or the load has failed.  Please make sure that the Flash Plugin is enabled and that a working version of the Adobe Flash Player is installed.
        </div>
        <div id="divAlternateContent" class="content" style="background-color: #FFFF66; border-top: solid 4px #FF9966; border-bottom: solid 4px #FF9966; margin: 10px 25px; padding: 10px 15px; display: none;">
            We're sorry.  SWFUpload could not load.  You may need to install or upgrade Flash Player.
            Visit the <a href="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash">Adobe website</a> to get the Flash Player.
        </div>
    </div>

    <div class="ovl_list_img" id="ajax_list_img">
        <div class="ovl_list_img_header" id="ajax_gallery_header">
            <div style="width:695px;overflow:hidden;">Chỉnh sửa ảnh cho tin</div>
            <div><img src="../../style/images/ovl_close.gif" id="popupClose" style="cursor:pointer; margin-left:660px; margin-top:-27px; position:absolute" /></div>
        </div>
        <div id="ovl_content">
            <div id="img-list">
                <div class="img-list-tool">
                    <div class="img-list-tool-content">
                        <form name="frmCrop" method="post">
                        	<table width="99%">
                            	<tr>
                                	<td width="28%" style="vertical-align:top;">

                            <div class="img-list-tool-box">
                                <div class="img-list-tool-guide">
                                    <p>Di chuyển khung bên cạnh để cắt một phần ảnh này làm ảnh đại diện</p>
                                    <div style="float:left;width:100%;text-align:center;margin-top:8px">
                                        <input type="button" id="btnEditImageSubmit" onmouseout="this.className='btnOvlSplit'" onmouseover="this.className='btnOvlSplitOver'" class="btnOvlSplit" value="&nbsp;">&nbsp;&nbsp;
                                        <input type="button" id="btnEditImageCancel" onmouseout="this.className='btnOvlCancel'" onmouseover="this.className='btnOvlCancelOver'" class="btnOvlCancel">
                                    </div>
                                </div>
                                <div style="margin-left:40px; margin-top:10px;">
                                    <div id="eb_quick_upload" style="display:none;float:left;">
                                        <label class="cabinet">
                                            <a href="#" style="position:absolute;">Chọn ảnh khác</a>
                                            <input type="file" id="fast_upload_avatar" name="fast_upload_avatar" class="file" onchange="return ajaxFileUpload();" />
                                        </label>
                                    </div>
                                    <div id="eb_flash_upload" style="display:none;float:left;">
                                        <div class="postItemOtherAvatar-choiceImg">
                                            <span id="spanButtonPlaceholder"></span>
                                            <a id="editItem-otherImage" style="cursor:pointer;">Chọn ảnh khác</a>
                                        </div>
                                    </div>
                                 </div>
                            </div>
                        </td>
                        <td id="image_tool_part" style="padding-left:20px;">

                                <img id="itemAvatarFullSize" src="<?php echo $img; ?>" width="<?php echo $fullSize['width']; ?>" height="<?php echo $fullSize['height']; ?>" style=" border: 1px solid #ccc"/>

                        </td>
                        </tr>
                        </table>
                            <input type="hidden" name="cropX1" value="" id="cropX1" />
                            <input type="hidden" name="cropY1" value="" id="cropY1" />
                            <input type="hidden" name="cropX2" value="" id="cropX2" />
                            <input type="hidden" name="cropY2" value="" id="cropY2" />
                            <input type="hidden" name="cropWidth" value="" id="cropWidth" />
                            <input type="hidden" name="cropHeight" value="" id="cropHeight" />
                            <input type="hidden" name="displayWidth" value="<?php echo $fullSize['width']; ?>" id="displayWidth" />
                            <input type="hidden" name="displayHeight" value="<?php echo $fullSize['height']; ?>" id="displayHeight" />
                            <input type="hidden" name="editImageID" value="<?php echo $img_id; ?>" id="editImageID" />
                        </form>
                    </div>
                </div>
            </div>
        </div>
	</div>
    <script>
		var requiredMajorVersion = 9; // Major version of Flash required
		var requiredMinorVersion = 0;// Minor version of Flash required
		var requiredRevision = 115;// Revision of Flash required
		
		var hasRightVersion = false;
		
		if (AC_FL_RunContent == 0 || DetectFlashVer == 0) {
			alert("This page requires AC_RunActiveContent.js.");
		} else {
			hasRightVersion = DetectFlashVer(requiredMajorVersion, requiredMinorVersion, requiredRevision);
		}
		if(jQuery.browser.msie||!hasRightVersion)
		{
			jQuery('#eb_quick_upload').css({'display':'inline'});
			jQuery('#eb_flash_upload').css('display','none');
			SI.Files.stylizeById('fast_upload_avatar');
		}
		else if(SWFUpload)
		{
			jQuery('#eb_flash_upload').css({'display':'inline'});
			jQuery('#eb_quick_upload').css('display','none');
		
			var swfu;
											
			SWFUpload.onload = function () {
				var settings = {
					flash_url : "../../javascript/swfupload/swfupload.swf",
					upload_url: WEB_DIR + "includes/ajax_action/swfupload.php?user_id=" + user_id,
					file_size_limit : "2 MB",
					file_types : "*.jpg;*.jpeg;*.gif;*.png",
					file_types_description : "Images files",
					file_upload_limit : 100,
					file_queue_limit : 0,
					custom_settings : {
						progressTarget : "fsUploadProgress"
						//cancelButtonId : "btnCancel"
					},
					debug: false,
			
					// Button Settings
					button_placeholder_id : "spanButtonPlaceholder",
					button_width: 105,
					button_height: 26,
					button_window_mode: SWFUpload.WINDOW_MODE.TRANSPARENT,
					button_cursor: SWFUpload.CURSOR.HAND,
			
					// The event handler functions are defined in handlers.js
					swfupload_loaded_handler : swfUploadLoaded,
					file_queued_handler : fileQueued,
					file_queue_error_handler : fileQueueError,
					file_dialog_complete_handler : fileDialogComplete,
					upload_start_handler : uploadStart,
					upload_progress_handler : uploadProgress,
					upload_error_handler : uploadError,
					upload_success_handler : uploadSuccess,
					upload_complete_handler : uploadComplete,
					queue_complete_handler : queueComplete,	// Queue plugin event
					
					// SWFObject settings
					minimum_flash_version : "9.0.28",
					swfupload_pre_load_handler : swfUploadPreLoad,
					swfupload_load_failed_handler : swfUploadLoadFailed
				};
				swfu = new SWFUpload(settings);
			}
		}
	</script>
</body>
</html>